import QtQuick 2.5
import QtMultimedia 5.6

Item {
    anchors.fill: parent

    // 媒体控制
    MediaPlayer {
        id: player

        // source: "dist/exam.ogg"
        // 播放列表支持
        playlist: Playlist {
            PlaylistItem { source: "dist/exam.ogg" }
            PlaylistItem { source: "dist/exam.ogg" }
            PlaylistItem { source: "dist/exam.ogg" }
        }

        // 自动播放
        autoPlay: true
        // 无限循环
        loops: MediaPlayer.Infinite
        onError: {
            console.log(errorString);
        }
        // 播放器状态槽函数
        onStatusChanged: {
            console.log(status)
        }
    }

    Camera {
        id: camera
    }

    // 媒体展示组件
    VideoOutput {
        id: vout
        anchors.fill: parent
        source: player
        // 使用系统摄像头
        // source: camera
    }

    // 声音组件
    SoundEffect {
        id: beep
        source: "dist/beep.wav"
    }

    // 播放音频按钮
    Rectangle {
        width: 80
        height: 30
        border.color: "black"
        anchors.top: parent.top
        anchors.topMargin: 20
        anchors.horizontalCenter: parent.horizontalCenter
        Text {
            text: "Beep!"
            anchors.centerIn: parent
        }
        MouseArea {
            anchors.fill: parent
            onClicked: {
                beep.play()
            }
        }
    }

    //    音频过渡效果
    //    SoundEffect {
    //        id: swosh
    //        source: "dist/swosh.wav"
    //    }
    //    transitions: [
    //        Transition {
    //            from: "*"; to: "*"
    //            ParallelAnimation {
    //                ScriptAction { script: swosh.play() }
    //                PropertyAnimation { properties: "rotation"; duration: 200 }
    //            }
    //        }
    //    ]

    // 进度栏
    Rectangle {
        id: progressBar
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        anchors.margins: 10
        height: 30
        color: "lightGray"

        // 进度块
        Rectangle {
            visible: true
            anchors.left: parent.left
            anchors.top: parent.top
            anchors.bottom: parent.bottom
            // 进度条位置
            width: player.duration > 0 ? parent.width * (player.position / player.duration) : 0
            color: "darkGray"
        }

        // Seek
        MouseArea {
            anchors.fill: parent
            onClicked: {
                if (player.seekable) {
                    // 总时长 x 进度条位置比例
                    player.seek(player.duration * (mouse.x / width));
                }
            }
        }
    }

    Component.onCompleted: {
        player.playlist.currentIndex = 0;
        player.play();
    }
}
